Tree Shaking 也叫摇树优化，是一种通过移除多于代码，从而减小最终生成的代码体积，生产环境默认开启。

原理：

ES6 模块系统：Tree Shaking的基础是ES6模块系统，它具有静态特性，
意味着模块的导入和导出关系在编译时就已经确定，不会受到程序运行时的影响。

静态分析：在Webpack构建过程中，Webpack会使用抽象语法树（AST）静态分析依赖图，
从入口文件开始，逐级追踪每个模块的依赖关系，以及模块之间的导入和导出关系。


标记未使用代码： 在分析模块依赖时，Webpack会标记每个变量、函数、类和导入，以确定它们是否被实际使用。
如果一个导入的模块只是被导入而没有被使用，或者某个模块的部分代码没有被使用，Webpack会将这些未使用的部分标记为"unused"。

删除未使用代码: 在代码标记为未使用后，Webpack会在最终的代码生成阶段，
通过工具（如UglifyJS等）删除这些未使用的代码。

需要注意的是，Tree Shaking只能移除未使用的代码，对于一些动态导入的模块或者在运行时才能确定的导入关系，无法进行优化。
因此，在编写代码时，需要注意使用静态导入和导出，以便Tree Shaking能够正常工作。
